<template>
	<view class="content">

		<view class="text-area">

			<uni-forms :modelValue="form" label-position="top">

				<uni-forms-item label="微信" required labelWidth="180px">
					<uni-data-checkbox @change="wxPayTypeFn" v-model="wxPayType" :localdata="wx"></uni-data-checkbox>
					<view class="bottomCheckBox" v-if="isWxMerchantPayment">

						<uni-data-checkbox @change="wxPayStatusFn" v-model="wxPayStatus"
							:localdata="wxStatus"></uni-data-checkbox>

					</view>
				</uni-forms-item>

				<uni-forms-item label="支付宝" required labelWidth="180px">
					<uni-data-checkbox @change="zfbPayTypeFn" v-model="zfbPayType" :localdata="zfb"></uni-data-checkbox>
					<view class="bottomCheckBox" v-if="isZfbMerchantPayment">

						<uni-data-checkbox @change="zfbPayStatusFn" v-model="zfbPayStatus"
							:localdata="zfbStatus"></uni-data-checkbox>


					</view>
				</uni-forms-item>

			</uni-forms>
			<view class="sumbit-btn flex" @click.stop="saveInfo()">
				保存信息
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'paymentConfiguration',
				form: {},
				wxPayType: 4,
				zfbPayType: 4,
				merchantId:  uni.getStorageSync('merchantId'),
				payTypeArr: [],
				// 是否启动
				isWxMerchantPayment: false,
				isZfbMerchantPayment: false,
				wxPayStatus: '',
				saveDisable: false,
                typeId:'',
		
				wx: [{
					text: '不启动',
					value: '4'
				}, {
					text: '启动',
					value: '1'
				}],
				zfb: [{
					text: '不启动',
					value: '4'
				}, {
					text: '启动',
					value: '2'
				}],
				wxStatus: [{
						text: 'V3商户支付',
						value: '2'
					},
					{
						text: '特约子商户支付',
						value: '1'
					}
				],
				zfbStatus: [{
						text: '普通商户支付',
						value: '4'
					},
					{
						text: '间连商户支付',
						value: '3'
					}
				]
			}
		},
		 mounted () {
		  this.searchType()
		  },
		methods: {
			wxPayTypeFn(e) {
				// const index =e.detail.value
				console.log(e.detail.value);
				if (e.detail.value == 1) {
					console.log(e.detail.value == 1)
					this.wxPayType = '1';
					this.wxPayStatusFn('2');
					this.isWxMerchantPayment = true;
					this.saveDisable = false
				} else {
					this.isWxMerchantPayment = false;
				}
				if (e.detail.value == '4') {
					this.wxPayType = '4';
					if (this.wxPayType == 4 && this.zfbPayType == 4) {
						this.saveDisable = true
					}
					this.wxPayStatus = ''
				}
			},
			wxPayStatusFn(e) {

				if (e.detail?.value) {
					console.log(e.detail?.value)
					this.wxPayStatus = e.detail?.value
				} else {
					console.log(e)
					this.wxPayStatus = e
				}

			},
			zfbPayTypeFn(e) {
				console.log(e.detail.value);
				if (e.detail.value == 2) {
					this.zfbPayType = '2';
					this.zfbPayStatusFn('4');
					this.saveDisable = false
					this.isZfbMerchantPayment = true;
				} else {
					this.isZfbMerchantPayment = false;
				}
				if (e.detail.value == '4') {
					this.zfbPayType = '4';
					if (this.wxPayType == 4 && this.zfbPayType == 4) {
						this.saveDisable = true
					}
					this.zfbPayStatus = ''
				}
			},
			zfbPayStatusFn(e) {

				if (e.detail?.value) {
					console.log(e.detail?.value)
					this.zfbPayStatus = e.detail?.value
				} else {
					console.log(e)

					this.zfbPayStatus = e
				}
			},
			async saveInfo() {
				this.payTypeArr = [this.wxPayStatus, this.zfbPayStatus]
				console.log(this.payTypeArr)
				if (this.payTypeArr.filter(item => item !== '').length) {
					this.payTypeArr = this.payTypeArr.filter(item => item !== '').join(',')
				} else {
					this.payTypeArr = ''
				}

				console.log(this.payTypeArr)

				const result = await this.$http.post({
					url: this.$api.payTypeInsertSelective,
					data: {
						payStatus: this.payTypeArr,
						merchantId: this.merchantId,
						id: this.typeId ? this.typeId : '',
						payType: this.payTypeFn(),
                        
					},


				});

				if (result.code == 2000) {
				
					this.searchType()
					this.$sun.toast(result.msg)
				}


			},
			payTypeFn() {
				if (this.wxPayType == '4' && this.zfbPayType == '4') {
					// 不启动
					return '';
				} else if (this.wxPayType == '1' && this.zfbPayType == '4') {
					return '1';
				} else if (this.wxPayType == '4' && this.zfbPayType == '2') {
					return '2';
				} else {
					return '3';
				}
			},
			async searchType() {
				
			
				const res = await this.$http.post({
					url: this.$api.payTypeSelectByPrimaryKey,
					data: {
					 merchantId: this.merchantId
				
					},
				
				
				});
				console.log(res.data?.id)
				this.typeId = res.data?.id
				//   payStatus // 对查询的内容进行区分
				this.payStatusArr = res.data?.payStatus.split(',')
				console.log(this.payStatusArr)
				if (this.payStatusArr) {
					this.payStatusArr.forEach((item) => {
						if (item == '1' || item == '2') {
							this.wxPayStatus = item
						} else {
							this.zfbPayStatus = item
						}
					})
				}
				// payType  // 如果类型为1 微信 2 支付宝 3 都启用
				if (res.data?.payType == 3) {
					this.wxPayType = '1'
					this.zfbPayType = '2'
					this.isWxMerchantPayment = true
					this.isZfbMerchantPayment = true
				} else if (res.data?.payType == 2) {
					this.wxPayType = '4'
					this.zfbPayType = '2'
					this.isZfbMerchantPayment = true
				} else if (res.data?.payType == 1) {
					this.isWxMerchantPayment = true
					this.wxPayType = '1'
					this.zfbPayType = '4'
				} else {
					this.wxPayType = '4'
					this.zfbPayType = '4'
				}
			},

		}
	}
</script>

<style lang="less">
	page {
		background-color: #fff;
	}

	.content {
		padding: 0 60rpx;

		.text-area {
			.bottomCheckBox {
				margin: 40rpx 0;
			}
		}

	}



	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}

	.sumbit-btn {
		width: 670rpx;
		position: fixed;

		bottom: 50rpx;

		height: 100rpx;
		color: #fff;
		border-radius: 10px;
		background-color: #1890FF;
	}
</style>